import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:smart_devices/icons/src/antd_icons.dart';
import 'package:smart_devices/params/spare_part.dart';
import 'package:smart_devices/routes/index.dart';
import 'package:smart_devices/utils/colors.dart';
import 'package:smart_devices/utils/styles.dart';
import 'package:smart_devices/utils/tools.dart';

import 'details_logic.dart';

class SpareDetailsView extends GetView<SpareDetailsLogic> {
  const SpareDetailsView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor:
            ColorsUtils.parseColorFromHexString(ColorsUtils.colorF6f6),
        appBar: AppBar(
          leading: IconButton(
              icon: const Icon(
                Icons.arrow_back_ios,
                color: Colors.white,
                size: 15,
              ),
              onPressed: Get.back),
          automaticallyImplyLeading: false,
          backgroundColor:
              ColorsUtils.parseColorFromHexString(ColorsUtils.color0052),
          title: Text(
            '关联备件',
            style: StylesUtils.customTextStyle(
                fontSize: 18, fontWeight: FontWeight.w700),
          ),
          centerTitle: true,
          systemOverlayStyle: SystemUiOverlayStyle.dark,
        ),
        body: Obx(() => SingleChildScrollView(
              padding: const EdgeInsets.only(bottom: 50),
              child: Column(
                children: [
                  Container(
                    margin: const EdgeInsets.only(top: 15),
                    color: Colors.white,
                    child: ListBody(
                      children: [
                        Container(
                          margin: const EdgeInsets.only(top: 15),
                          decoration: const BoxDecoration(color: Colors.white),
                          child: ListBody(
                            children: [
                              SizedBox(
                                height: 40,
                                child: CustomPaint(
                                    painter: _MyCustomPaintLine(),
                                    child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Container(
                                          margin:
                                              const EdgeInsets.only(left: 30),
                                          alignment: Alignment.centerLeft,
                                          child: Text(
                                            '备件信息',
                                            style: StylesUtils.customTextStyle(
                                                color: ColorsUtils.color6666),
                                          ),
                                        ),
                                        InkWell(
                                          onTap: () {
                                            Get.toNamed(Routes.deviceSpareInfo,
                                                arguments:
                                                    controller.details.value);
                                          },
                                          child: Container(
                                            alignment: Alignment.centerRight,
                                            padding: const EdgeInsets.only(
                                                right: 10),
                                            child: Text(
                                              '备件详情',
                                              style:
                                                  StylesUtils.customTextStyle(
                                                      color: ColorsUtils
                                                          .color0052),
                                            ),
                                          ),
                                        )
                                      ],
                                    )),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '备件编码',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          controller.details.value.code,
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '备件名称',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          controller.details.value.name,
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '备件类型',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          '${controller.details.value.type?.label}',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '备件单位',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          '${SparePartUnitEnum.values.length}个',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '当前库存',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          '${controller.details.value.inventory}',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              SizedBox(
                                height: 50,
                                child: Row(
                                  children: [
                                    Container(
                                      width: 100,
                                      alignment: Alignment.centerLeft,
                                      padding: const EdgeInsets.only(left: 30),
                                      child: Text(
                                        '更换数量',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color3333),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        padding:
                                            const EdgeInsets.only(left: 10),
                                        alignment: Alignment.centerLeft,
                                        child: Text(
                                          '${controller.details.value.change}',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color9999),
                                        ),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(top: 15, left: 10, right: 10),
                    decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(5)),
                    child: ListBody(
                      children: [
                        SizedBox(
                          height: 50,
                          child: Row(
                            children: [
                              Container(
                                width: 50,
                                alignment: Alignment.center,
                                child: ToolsUtils.assetImageSvg('u50347.svg',
                                    width: 20, height: 20),
                              ),
                              Container(
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '维修工单',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color3333),
                                ),
                              ),
                              Expanded(
                                  child: Container(
                                padding: const EdgeInsets.only(left: 15),
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '最后更换2022-11-15（2）',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color9999),
                                ),
                              )),
                              InkWell(
                                onTap: () {
                                  Get.toNamed(Routes.deviceRepairOrder,
                                      arguments: controller.details.value);
                                },
                                child: Container(
                                  width: 50,
                                  alignment: Alignment.center,
                                  child: Icon(
                                    AntdIcons.right,
                                    color: ColorsUtils.parseColorFromHexString(
                                        ColorsUtils.color9999),
                                    size: 15,
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        SizedBox(
                          height: 50,
                          child: Row(
                            children: [
                              Container(
                                width: 50,
                                alignment: Alignment.center,
                                child: ToolsUtils.assetImageSvg('u50350.svg',
                                    width: 20, height: 20),
                              ),
                              Container(
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '保养任务',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color3333),
                                ),
                              ),
                              Expanded(
                                  child: Container(
                                padding: const EdgeInsets.only(left: 15),
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '最后更换2022-11-15（5）',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color9999),
                                ),
                              )),
                              InkWell(
                                onTap: () {
                                  Get.toNamed(Routes.deviceUpkeepTask,
                                      arguments: controller.details.value);
                                },
                                child: Container(
                                  width: 50,
                                  alignment: Alignment.center,
                                  child: Icon(
                                    AntdIcons.right,
                                    color: ColorsUtils.parseColorFromHexString(
                                        ColorsUtils.color9999),
                                    size: 15,
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        SizedBox(
                          height: 50,
                          child: Row(
                            children: [
                              Container(
                                width: 50,
                                alignment: Alignment.center,
                                child: ToolsUtils.assetImageSvg('u50348.svg',
                                    width: 20, height: 20),
                              ),
                              Container(
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '保养工单',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color3333),
                                ),
                              ),
                              Expanded(
                                  child: Container(
                                padding: const EdgeInsets.only(left: 15),
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '最后更换2022-11-15（8）',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color9999),
                                ),
                              )),
                              InkWell(
                                onTap: () {
                                  Get.toNamed(Routes.deviceMaintainOrder,
                                      arguments: controller.details.value);
                                },
                                child: Container(
                                  width: 50,
                                  alignment: Alignment.center,
                                  child: Icon(
                                    AntdIcons.right,
                                    color: ColorsUtils.parseColorFromHexString(
                                        ColorsUtils.color9999),
                                    size: 15,
                                  ),
                                ),
                              )
                            ],
                          ),
                        )
                      ],
                    ),
                  )
                ],
              ),
            )));
  }
}

class _MyCustomPaintLine extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    /// w = 10, h = 20
    Paint paint = Paint()
      ..isAntiAlias = false
      ..color = ColorsUtils.parseColorFromHexString(ColorsUtils.color0052)
      ..style = PaintingStyle.fill;
    Rect rect = const Rect.fromLTWH(10, 10, 10, 20);
    canvas.drawRect(rect, paint);

    Offset p1 = Offset(0, size.height);
    Offset p2 = Offset(size.width, size.height);

    canvas.drawLine(
        p1,
        p2,
        paint
          ..color = ColorsUtils.parseColorFromHexString(ColorsUtils.colorE4e4));
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return this != oldDelegate;
  }
}
